<template>
  <div class="main">
  
  <tab >
    <tab-item v-bind:selected="selectedc"   @on-item-click="tabClick(true)">常见问题</tab-item>
    <tab-item v-bind:selected="!selectedc" @on-item-click="tabClick(false)">操作指南</tab-item>
  </tab>
  <div v-if="tabindex" >
    <div class="bigtitle"><h1>常见问题<span class="futit">Common problem</span></h1></div>
    <div class="searching"><input type="text" v-model="searchval" placeholder="请输入关键词"><a @click="search()"><x-icon type="ios-search-strong" size="30" class="btnsearch"></x-icon></a></div>
    <div class="question">
    <scroller lock-x height="-110" @on-scroll-bottom="onScrollBottom" ref="scrollerBottom" :scroll-bottom-offst="1000">
      
      <ul>
        <li v-for = "(item,index) in newslist">
           <a @click='gohref(item)'>
            <h1><i class="bluefont">Q</i><span>{{item.ntitle}}</span></h1>
            <p><i class="bluefont">A</i><span>{{item.nbody|striphtml}}</span></p>
          </a>
        </li>

         

      </ul>
       <load-more  v-if="pages > pageNum" :tip="' 正在加载 '"></load-more>
       <load-more v-if="pages == pageNum" :show-loading="false" :tip="' 暂无数据 '" background-color="#fbf9fe"></load-more>
        </scroller>
    <!--   <div class="page">
         <div class="">
         <a href="javascript:void(0);" class="prev" v-on:click="prev" ><span>&lt;</span></a>
         <a href="javascript:void(0);" class="prev"><span>{{pageNum}}/{{pages}}</span></a>
         <a href="javascript:void(0);" class="prev"  v-on:click="next" ><span>&gt;</span></a>
         </div>
    </div> -->
    </div>

    
  </div>

  <div id="cangdan" v-else >
    <div class="bigtitle"><h1>操作指南<span class="futit">Operation guide</span></h1></div>
    <div class="searching"><input type="text" v-model="searchval2" placeholder="请输入关键词"><a @click="search2()"><x-icon type="ios-search-strong" size="30" class="btnsearch"></x-icon></a></div>
    <div class="caozuo">
     <scroller lock-x height="-110" @on-scroll-bottom="onScrollBottom2" ref="scrollerBottom2" :scroll-bottom-offst="1000">
      <ul>
      
      <li v-for = "(item,index) in newslist2">
         <!-- :to="{path:'/News_detail',query:{id:item.nid}}" -->
          <a @click='gohref(item)'>
           <div class="leftpart"><img src="../assets/images/download.png" alt=""><p>下载</p></div>
           <h1>{{item.ntitle}}</h1>
          </a>
        </li>
     
    </ul>
    <load-more  v-if="pages2 > pageNum2" :tip="' 正在加载 '"></load-more>
       <load-more v-if="pages2 == pageNum2" :show-loading="false" :tip="' 暂无数据 '" background-color="#fbf9fe"></load-more>
        </scroller>
      <!-- <div class="page">
         <div class="">
         <a href="javascript:void(0);" class="prev" v-on:click="prev2" ><span>&lt;</span></a>
         <a href="javascript:void(0);" class="prev"><span>{{pageNum2}}/{{pages2}}</span></a>
         <a href="javascript:void(0);" class="prev"  v-on:click="next2" ><span>&gt;</span></a>
         </div>
    </div> -->
  </div>
</div>




<router-view  name="footer"></router-view>

</div>
</template>



<script>







import { Scroller, Divider, Spinner, XButton, Group, Cell, LoadMore } from 'vux'

export default {
    name: 'Question2',
  components: {
    Scroller,
    LoadMore
  },
  data () {
    return {
      onFetching: false,
      onFetching2: false,
       newslist: [],
    newslist2: [],
    pageSize:5,
    pageNum:1,
    pages:1,
    pageNum:1,
    searchval:"",
    pageSize2:5,
    pageNum2:1,
    pages2:1,
    pageNum2:1,
    searchval2:"",
    activetz:true,
    selectedc:true,
    tabindex:true
    }
  },
 
  created (s) {
    
    if(this.$route.query.type==2){
      this.tabindex=false;
      this.selectedc=false;
    }
    
   this.getList();
   this.getList2();
  },
  methods: {
    onScrollBottom () {
      if (this.onFetching) {

        // do nothing
      } else {
         
        this.onFetching = true
        setTimeout(() => {
          this.next(),
          this.onFetching = false
        }, 2000)
      }
    },
    onScrollBottom2 () {
      if (this.onFetching2) {

        // do nothing
      } else {
         
        this.onFetching2 = true
        setTimeout(() => {
          this.next2(),
          this.onFetching2 = false
        }, 2000)
      }
    },
      tabClick (index) {
       this.tabindex = index
     },search(){
      this.pageNum=1;
      this.getList(1);
     },search2(){
      this.pageNum2=1;
      this.getList2(1);
     },
　　　　selectStyle (b) {
        this.activetz=b;
    },gohref(item){
      if(item.ntype==1){
        this.$router.push({path:'/News_detail',query:{id:item.nid}});
      }
       if(item.ntype==2 || item.ntype==3){
        const nurl=item.nurl;
        if(nurl.substr(0, 1) == "/") { 
          window.location.href = this.GLOBAL.apiurl+item.nurl;
        }else{
         window.location.href = item.nurl;
        }
       }
    }
    ,prev() {
      if(this.pageNum<2){
        return ;
      }
      this.pageNum=this.pageNum-1;
      this.getList();
    },next() {
      if(this.pageNum>=this.pages){
        return ;
      }
      this.pageNum=this.pageNum+1;
      this.getList();
    }
    ,prev2() {
      if(this.pageNum2<2){
        return ;
      }
      this.pageNum2=this.pageNum2-1;
      this.getList2();
    },next2() {
      if(this.pageNum2>=this.pages2){
        return ;
      }
      this.pageNum2=this.pageNum2+1;
      this.getList2();
    },getList(p){

       this.$http.get(this.GLOBAL.question+'?s='+this.pageSize+'&p='+this.pageNum+'&keyword='+this.searchval).then(({data}) => {
     
      if(data.res_code==1){
        if(this.newslist==[]){
          this.newslist = this.newslist;
        }else{
          this.newslist = this.newslist.concat(data.data.list);
        }
        
       this.pageNum=data.data.page.pageNum;
       this.pages=data.data.page.pages;
       this.pageNum=data.data.page.pageNum;

      }
    })
    },getList2(p){
       this.$http.get(this.GLOBAL.notice+'?s='+this.pageSize2+'&p='+this.pageNum2+'&keyword='+this.searchval2).then(({data}) => {
     
      if(data.res_code==1){
         if(this.newslist2==[]){
          this.newslist2 = this.newslist2;
        }else{
          this.newslist2 = this.newslist2.concat(data.data.list);
        }
       this.pageNum2=data.data.page.pageNum;
       this.pages2=data.data.page.pages;
       this.pageNum2=data.data.page.pageNum;

      }
    })
    }

 
  }
}
</script>

